﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ImageVideosUpload.aspx.cs"
    Inherits="ImageVideosUpload" %>

<%@ Register Src="UserControls/ImageControl.ascx" TagName="ImageControl" TagPrefix="uc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <script type="text/javascript">
        function OnImageClick(obj) {
            var list = document.getElementById("lstFilePath");
            // PageMethods.imageSelectDeselect(obj.id);

            //            alert(list);
            //            alert(obj.style.borderColor);
            if (obj.style.borderColor == 'rgb(0, 0, 139)') {
                obj.style.borderColor = 'white';

                for (var i = 0; i < list.options.length; ++i) {
                    //alert(obj.src + ',' + list.options[i].text);

                    //alert(obj.src.indexOf(list.options[i].text));
                    if (obj.src.indexOf(list.options[i].text) != -1) {
                        desSlectedFiles.value += list.options[i].text + "+";

                    }
                }
                //alert("Deselect files " + desSlectedFiles.value);
            }
            else if (obj.style.borderColor == 'white') {
                obj.style.borderColor = 'rgb(0, 0, 139)';

                for (var i = 0; i < list.options.length; ++i) {
                    if (obj.src.indexOf(list.options[i].text) != -1) {
                        desSlectedFiles.value = desSlectedFiles.value.replace(list.options[i].text, "");
                    }
                }
                //alert("Deselect files " + desSlectedFiles.value);
            }
        }

        function OnVideoClick(obj) {
            alert("Video Click called");
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table cellpadding="3" cellspacing="3" border="0" style="background-color: #f6f5f6">
            <tr>
                <td valign="top">
                    <table border="0" cellpadding="5" cellspacing="5">
                        <tr>
                            <td>
                                <asp:Image runat="server" ID="imgPhotoTick" ImageUrl="~/Image/Tick.png" Visible="false" />
                                <asp:LinkButton Style="text-decoration: none" runat="server" ID="linkPhotoUpload"
                                    Text="Upload Photos" Font-Size="11" Font-Names="Verdana" OnClick="linkPhotoUpload_Click" />
                            </td>
                        </tr>
                        <%--<tr>
                            <td>
                                <asp:Image runat="server" ID="imgVideoTick" ImageUrl="~/Image/Tick.png" Visible="false" />
                                <asp:LinkButton Style="text-decoration: none" runat="server" ID="linkVideoUpload"
                                    Text="Upload Videos" Font-Size="11" Font-Names="Verdana" OnClick="linkVideoUpload_Click" />
                            </td>
                        </tr>--%>
                    </table>
                </td>
                <td valign="top">
                    <table border="0" style="background-color: White" width="500" height="400">
                        <tr>
                            <td valign="top" height="35">
                                <asp:Panel runat="server" ID="PhotoPanel">
                                    <asp:FileUpload ID="UploadImage" runat="server" />
                                    &nbsp&nbsp
                                    <asp:Button ID="btnUpload" Text="Upload" runat="server" BackColor="#5C7BB3" BorderColor="Black"
                                        BorderStyle="None" ForeColor="White" Font-Names="verdana" Font-Size="11pt" OnClick="btnUpload_Click" />
                                    <br />
                                    <asp:Label ID="lblText" Text="* Please click on upload button after choosing an Image." Font-Size="9" Font-Names="Verdana"
                                        runat="server" ForeColor="Red"/>
                                </asp:Panel>
                                <%--<asp:Panel runat="server" ID="VideoPanel">
                                    <table border="0">
                                        <tr>
                                            <td>
                                                <asp:Image runat="server" ID="imgYoutube" ImageUrl="~/Image/youtube.png" />
                                            </td>
                                            <td>
                                                <asp:TextBox runat="server" ID="txtVideoPath" Font-Names="verdana" Font-Size="9"
                                                    ForeColor="gray" Text=" Paste Youtube Video Path Here......" onclick="this.style.color='black'"
                                                    onmouseout="this.style.color='gray'" Width="280" Height="25" onfocus="if(this.value==' Paste Youtube Video Path Here......')this.value=''"
                                                    onblur="if(this.value=='')this.value=' Paste Youtube Video Path Here......'"
                                                    BorderColor="#EEEFF0" BorderStyle="Solid" />
                                                &nbsp&nbsp
                                                <asp:Button ID="btnLoad" Text="Load" runat="server" BackColor="#5C7BB3" BorderColor="Black"
                                                    BorderStyle="None" ForeColor="White" Height="25" Font-Names="verdana" 
                                                    Font-Size="11pt" onclick="btnLoad_Click" />
                                            </td>
                                        </tr>
                                    </table>
                                </asp:Panel>--%>
                            </td>
                        </tr>
                        
                        <tr>
                            <td valign="top">
                                <asp:PlaceHolder ID="PhotoPlaceholder"  runat="server" OnPreRender="PhotoPlaceholder_PreRender" />
                                <%--<asp:PlaceHolder ID="VideoPlaceholder"  runat="server" OnPreRender="VideoPlaceholder_PreRender" />--%>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td>
                    <div style="display: none;">
                        <%--<select id="lstFilePath" runat="server" >
                        <option></option>
                    </select>--%>
                        <asp:ListBox ID="lstFilePath" runat="server"></asp:ListBox>
                        <asp:ListBox ID="lstVideoPath" runat="server"></asp:ListBox>
                        <asp:HiddenField ID="desSlectedFiles" runat="server" />
                    </div>
                    <%--<select id="ddlFilePath" runat="server" >
                        <option></option>
                    </select>--%>                    <%-- <dropdownlist id="ddlFilePath" runat="server" Visible="false" />--%>
                </td>
                <td align="right">
                    <input type="button" id="btnCancle" value="Cancel" onclick="javascript:window.close();"
                        style="font-family: verdana; font-size: 11pt; color: #FFFFFF; border-style: none;
                        border-color: #000000; background-color: #5C7BB3">
                    &nbsp&nbsp&nbsp&nbsp
                    <asp:Button ID="btnAddSelected" Text="Add Selected" runat="server" BackColor="#5C7BB3"
                        BorderColor="Black" BorderStyle="None" ForeColor="White" Font-Names="verdana"
                        Font-Size="11pt" OnClick="btnAddSelected_Click" />
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>
